<script setup lang="ts">
import { errimage } from '#/base';
import { guanlianprdStore } from '#/store';

const guanlianprd = guanlianprdStore();

// function jumpTo1688() {
//   open(
//     encodeURI(
//       `https://dly1688.lntelliai.com/records/up-pruduct-records?shopData=${JSON.stringify(indlyfor1688tody.shopData)}`,
//     ),
//   );
// }
</script>

<template>
  <div class="relative h-full overflow-hidden p-2 pb-12" style="width: 25%">
    <div class="h-full overflow-y-auto p-2">
      <div
        v-for="(item, index) in guanlianprd.images"
        :key="index"
        :class="{
          'border-amber-500': guanlianprd.selectImage === item.id,
        }"
        class="mb-2 flex cursor-pointer items-center rounded-sm border p-2"
        @click="guanlianprd.setSelectImage(item.id)"
      >
        <div style="width: 80px; height: 80px">
          <a-image
            :fallback="errimage"
            :src="item.url"
            class="rounded-sm"
            style="width: 80px; height: 80px"
          />
        </div>

        <div class="ml-2" style="flex: 1">
          <div class="mb-2 text-sm text-gray-700">{{ item.name }}</div>
          <div v-if="item.id" class="text-xs text-gray-400">
            商品ID:{{ item.id }}
          </div>
          <!-- <a-tag :color="!item.selectNum ? 'orange' : 'green'">
            {{ !item.selectNum ? '未选择' : `已选择${item.selectNum}个商品` }}
          </a-tag> -->
          <!-- <a-button size="small">取消选择</a-button> -->
        </div>

        <!-- <img :src="item.url" alt="" class="w-1/2" /> -->
        <!-- <img :src="images[1]" alt="" class="w-1/2" /> -->
      </div>
    </div>
    <!-- <div
      class="absolute bottom-0 left-0 flex w-full justify-end bg-white px-4 py-2"
    >
      <a-button type="primary" @click="jumpTo1688">查看铺货列表</a-button>
    </div> -->
  </div>
</template>
